<template>
	<view class="page1">
		<view class="title">完成注册，只差一步</view>
		<view class="content">
			<!-- <image src="/static/icon/sctx.png" class="sctx" @click="chooseimg()" v-if="!tempFilePath"></image> -->
			<image :src="tempFilePath" class="sctx" @click="chooseimg()" v-if="tempFilePath"></image>
			<view class="title">上传头像</view>
			<view class="form">
				<view class="form-item">
					<view class="lable">真实姓名</view>
					<uni-easyinput v-model="baseFormData.name" placeholder="请输入真实姓名" :styles="{borderColor: '#fff'}" />
				</view>
				<view class="form-item">
					<view class="lable">身份证号</view>
					<uni-easyinput v-model="baseFormData.idNumber" placeholder="请输入身份证号" :styles="{borderColor: '#fff'}" />
				</view>
				<view class="form-item">
					<view class="lable">手机号</view>
					<uni-easyinput v-model="baseFormData.mobileTel" placeholder="请输入手机号" :styles="{borderColor: '#fff'}" />
				</view>
				<view class="form-item-2">
					<view class="lable">我是</view>
					<view style="display: flex;justify-content: space-between;">
						<view v-for="(item,index) in list" class="item" :class="{active:activeUrl==item.url}" @click="select(item)">
							{{item.title}}
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="submit-btn" @click="submit()">提交</view>
		<uni-popup ref="popup" type="dialog">
			<uni-popup-dialog type="info" cancelText="关闭" :content="messageText"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tempFilePath: "",
				// 基础表单数据
				baseFormData: {
					name: '',
					idNumber: '',
					mobileTel: '',
					roleType: 0
				},
				activeUrl: "",
				list: [{
					title: "会员",
					url: "myMember",
					value: 1,
				}, {
					title: "医生",
					url: "myDoctor",
					value: 2,
				}, {
					title: "康复师",
					url: "myRehabilitation",
					value: 3,
				}, {
					title: "康复顾问",
					url: "myRehabilitationCounselor",
					value: 4,
				}],
				messageText: ""
			};
		},
		mounted() {
			// this.getUserInfo();
		},
		methods: {
			select(item) {
				this.activeUrl = item.url;
				this.baseFormData.roleType = item.value;
			},
			chooseimg() {
				let that = this
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album'],
					success: function(res) {
						that.tempFilePath = res.tempFilePaths[0];
						// 预览图片
						// uni.previewImage({
						// 	urls: res.tempFilePaths,
						// 	longPressActions: {
						// 		itemList: ['发送给朋友', '保存图片', '收藏'],
						// 		success: function(data) {
						// 			console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
						// 		},
						// 		fail: function(err) {
						// 			console.log(err.errMsg);
						// 		}
						// 	}
						// });
					}
				});
			},
			getUserInfo() {
				// 现在微信不返回用户信息了
				uni.getUserInfo({
					provider: "weixin",
					success: (infoRes) => {
						this.tempFilePath = infoRes.userInfo.avatarUrl; // 默认使用用户微信头像
					},
				});
			},
			submit() {
				let that = this
				if (!this.baseFormData.name) {
					// this.messageText ="请填写真实姓名"
					// this.$refs.popup.open()
					uni.showModal({
						content: '请填写真实姓名',
						showCancel: false,
						buttonText: '确定',
					})
					return
				}
				if (!this.baseFormData.idNumber) {
					uni.showModal({
						content: '请填写身份证号',
						showCancel: false,
						buttonText: '确定',
					})
					return
				}
				if (this.baseFormData.roleType <= 0) { 
				    uni.showModal({ 
				        content: '请选择您的角色', // 添加缺失的单引号
				        showCancel: false, 
				        buttonText: '确定', 
				    }) 
				    return 
				}
				if (!this.baseFormData.mobileTel) {
					uni.showModal({
						content: '请填写手机号',
						showCancel: false,
						buttonText: '确定',
					})
					return
				}
				// if (!this.tempFilePath) {
				// 	uni.showModal({
				// 		content: '请上传头像',
				// 		showCancel: false,
				// 		buttonText: '确定',

				// 	})
				// 	return
				// }
				// if (!this.activeUrl) {
				// 	uni.showModal({
				// 		content: '请选择角色',
				// 		showCancel: false,
				// 		buttonText: '确定',

				// 	})
				// 	return
				// }
				uni.request({
					url: "https://guokang365.mordo-care.com/api/miniWechat/bingUser",
					method: 'POST',
					//仅为示例，并非真实接口地址。
					data: {
						wechatId: getApp().globalData.wechatId,
						name: this.baseFormData.name,
						idNumber: this.baseFormData.idNumber,
						mobileTel: this.baseFormData.mobileTel,
						roleType: this.baseFormData.roleType,
					},
					// header: {
					//     'custom-header': 'hello' //自定义请求头信息
					// },
					success: (res) => {
						if (res.data.result === '100') {
							// 根据角色，进行跳转，同时将serverSession以及角色类型和角色id等信息 存到缓存中
							getApp().globalData.wechatId = res.data.wechatId;
							getApp().globalData.roleNames = res.data.roleNames;
							getApp().globalData.serverSession = res.data.serverSession;
							getApp().globalData.userId = res.data.userId;
							if (res.data.roleNames === '会员') {
								that.activeUrl = 'myMember';
								getApp().globalData.userType = 1;
								getApp().globalData.memberId = res.data.memberId;
							} else if (res.data.roleNames === '医生') {
								that.activeUrl = 'myDoctor';
								getApp().globalData.userType = 2;
								getApp().globalData.doctorId = res.data.doctorId;
							} else if (res.data.roleNames === '康复师') {
								that.activeUrl = 'myRehabilitation';
								getApp().globalData.userType = 3;
								getApp().globalData.recureTeacherId = res.data.recureTeacherId;
							} else if (res.data.roleNames === '康复顾问') {
								that.activeUrl = 'myRehabilitationCounselor';
								getApp().globalData.userType = 4;
								getApp().globalData.recureAdviserId = res.data.recureAdviserId;
							}
							getApp().globalData.activeUrl = that.activeUrl;
							uni.switchTab({
								url: "/pages/my/index"
							});
						} else if (res.data.result === '400') {
							uni.showModal({
								content: '微信注册信息未查询到',
								showCancel: false,
								buttonText: '确定',
							})
						} else if (res.data.result === '500') {
							uni.showModal({
								content: '未查询到主体信息，请核对提交信息',
								showCancel: false,
								buttonText: '确定',
							})
						} else if (res.data.result === '600') {
							uni.showModal({
								content: '手机号已注册，请核对提交信息',
								showCancel: false,
								buttonText: '确定',
							})
						} else {
							uni.showModal({
								content: '绑定主题提交失败',
								showCancel: false,
								buttonText: '确定',
							})
						}
					},
				});
				console.log("that.activeUrl", that.activeUrl)
			},
		},
	};
</script>

<style lang="scss" scoped>
	.page1 {
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background-repeat: repeat;
		background-size: cover;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background-image: url(http://file.40017.cn/cvg-marketingcenter-bucket/2023/04/28/1682670207008/bg.png?AWSAccessKeyId=OMO0W0EBD0C2S4M594EI&Expires=4102329600&Signature=omNEUs8G5uLuzmQMoOOE3kiCgJ8%3D);

	}

	.title {
		height: 51rpx;
		font-size: 36rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #42AE49;
		line-height: 51rpx;
		margin: 22rpx 0 32rpx;
	}

	.content {
		width: 707rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 5rpx 22rpx 0rpx #DEECDF;
		border-radius: 30rpx;
		background: #FFFFFF;
		padding: 82rpx 42rpx 55rpx;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;

		.sctx {
			width: 181.16rpx;
			height: 181.16rpx;
			border-radius: 50%;
		}

		.title {
			height: 39rpx;
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #42AE49;
			line-height: 39rpx;
			margin: 32rpx 0 20rpx;
		}

		.form-item {
			display: flex;
			align-items: center;
			width: 600rpx;
			padding: 10rpx 0;
			border-bottom: 2rpx solid #D9D9D9;
			;

			.lable {
				height: 39rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #515151;
				line-height: 39rpx;
				width: 150rpx;
			}

		}
	}

	.form-item-2 {

		.lable {
			height: 39rpx;
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #515151;
			line-height: 39rpx;
			width: 150rpx;
			margin: 50rpx 0 30rpx;
		}

		.item {
			width: 140rpx;
			height: 139rpx;
			background: #F0F0F0;
			border-radius: 18rpx;
			font-size: 25rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #42AE49;
			line-height: 139rpx;
			text-align: center;
		}

		.active {
			background: #42AE49;
			color: #FFFFFF;
		}
	}

	.submit-btn {
		width: 628rpx;
		height: 85rpx;
		background: #42AE49;
		border-radius: 46rpx;
		text-align: center;
		color: #FFFFFF;
		line-height: 85rpx;
		margin: 66rpx 0 100rpx;
	}
</style>